<template>
    <div id="branchDetail">
        <div class="functionalArea">
            <el-form class="formEmbedTable" :model="toDetail">
                <table> 
                    <tr>
                        <td>Transaction Sequence No.</td>
                        <td>{{toDetail.flowNo}}</td>	
                    </tr>
                    <tr>
                        <td>Submit</td>
                        <td>{{toDetail.userAlias}}</td>	
                    </tr>
                </table>
            </el-form>
        </div>
        <!--新增无需对比 -->
        <div v-if="detailData.actionType==0">
            <el-form  :model="detailData" class="formEmbedTable mt20">
                <table>
                    <caption>{{"Add"}}</caption>
                    <tr>
                        <td>Parent Department</td>
                        <td>{{detailData.brhParentName}}</td>
                        <td>Abbreviation</td>
                        <td>{{detailData.brhShortName}}</td>					
                    </tr>
                    <tr>
                        <td>Department No.</td>
                        <td>{{detailData.brhId}}</td>
                        <td>Department Name</td>
                        <td>{{detailData.brhName}}</td>					
                    </tr>
                    <tr>
                        <td>Category</td>
                        <td>{{ $tools.dict.BranchLevel(detailData.brhLevel)}}</td>
                        <td>Status</td>
                        <td>{{detailData.brhStatus==0?"Active":detailData.brhStatus==1?"Suspended":detailData.brhStatus==2?"cancel":""}}</td>
                    </tr>
                    <tr>
                        <td>Area Code</td>
                        <td>{{detailData.brhRegionId}}</td>
                        <td>Address</td>
                        <td>{{detailData.brhAddress}}</td>
                    </tr>
                    <tr>
                        <td>Phone No.</td>
                        <td>{{detailData.brhPhone}}</td>
                        <td>Description</td>
                        <td>{{detailData.brhDesc}}</td>
                    </tr>
                </table>
            </el-form>
        </div>
        <!-- 修改对比-->
        <div v-else>
            <el-form  :model="detailData" class="formEmbedTable mt20">
                <table>
                    <caption>{{"Modify"}}</caption>
                    <tr>
                        <td colspan="2" style="text-align:center;">{{"Before"}}</td>
                        <td colspan="2" style="text-align:center;">{{"After"}}</td>					
                    </tr>
                    <tr>
                        <td>Parent Department</td>
                        <td>{{detailData.brhParentName}}</td>	
                        <td>Parent Department</td>
                        <td>{{detailData.brhParentName}}</td>		
                    </tr>
                    <tr id="brhShortName">
                        <td>Abbreviation</td>
                        <td>{{oldBrhInf.brhShortName}}</td>	
                        <td>Abbreviation</td>
                        <td>{{detailData.brhShortName}}</td>			
                    </tr>
                    <tr id="brhId">
                        <td>Department No.</td>
                        <td>{{oldBrhInf.brhId}}</td>	
                        <td>Department No.</td>
                        <td>{{detailData.brhId}}</td>
                    </tr>
                    <tr id="brhName">
                        <td>Department Name</td>
                        <td>{{oldBrhInf.brhName}}</td>
                        <td>Department Name</td>
                        <td>{{detailData.brhName}}</td>
                    </tr>
                    <tr id="brhLevel">
                        <td>Category</td>
                        <td>{{$tools.dict.BranchLevel(oldBrhInf.brhLevel)}}</td>
                        <td>Category</td>
                        <td> {{ $tools.dict.BranchLevel(detailData.brhLevel)}} </td>
                    </tr>
                    <tr id="brhStatus">
                        <td>Status</td>
                        <td>{{oldBrhInf.brhStatus==0?"Active":oldBrhInf.brhStatus==1?"Suspended":oldBrhInf.brhStatus==2?"注销":""}}</td>
                        <td>Status</td>
                        <td>{{ detailData.brhStatus==0?"Active":detailData.brhStatus==1?"Suspended":detailData.brhStatus==2?"注销":""}}</td>
                    </tr>
                    <tr id="brhRegionId">
                        <td>Area Code</td>
                        <td>{{oldBrhInf.brhRegionId}}</td>
                        <td>Area Code</td>
                        <td>{{detailData.brhRegionId}}</td>
                    </tr>
                    <tr id="brhAddress">
                        <td>Address</td>
                        <td>{{oldBrhInf.brhAddress}}</td>
                        <td>Address</td>
                        <td>{{detailData.brhAddress}}</td>
                    </tr>
                    <tr id="brhPhone">
                        <td>Phone No.</td>
                        <td>{{oldBrhInf.brhPhone}}</td>
                        <td>Phone No.</td>
                        <td>{{detailData.brhPhone}}</td>
                    </tr>
                    <tr id="brhDesc">
                        <td>Description</td>
                        <td>{{oldBrhInf.brhDesc}}</td>
                        <td>Description</td>
                        <td>{{detailData.brhDesc}}</td>
                    </tr>
                </table>
            </el-form>
        </div>
        <div class="btnArea mt20 tac">
            <el-button type="primary" @click="agree()">Approve</el-button>
            <el-button type="primary" @click="rules()">Reject</el-button>
            <el-button type="primary" icon="close" @click="back">Back</el-button>
        </div>
        <!--拒绝页面弹窗-->
        <el-dialog :visible.sync="dialogTableVisible" :close-on-click-modal="false" :close-on-press-escape="false">
            <el-form ref="rejectForm" :model="rejectForm" class="formEmbedTable">
                <table>
                    <caption>Refusal reason</caption>
                    <tr>
                        <td>Refusal reason</td>
                        <td>
                            <el-form-item prop="rejReason">
                                <el-input placeholder="Refusal reason" v-model="rejectForm.rejReason"></el-input>
                            </el-form-item>
                        </td>
                    </tr>
                </table>
                <div class="btnArea mt20 tac">
                    <el-button type="primary" @click="dialogTableVisible = false,reject()">Confirm</el-button>
                    
                </div>
            </el-form>
        </el-dialog>
        <!--拒绝页面弹窗end-->
    </div>
</template>

<script>
    import ghbIcon from '@src/components/icon'
    export default {
        name:'branchDetail',
        components:{
			ghbIcon
		},
        props:['detailData','toDetail','oldDetailData'],
        data(){
            return {
                rejectForm:{//审核拒绝列表
                    actionFlag:'',bsnAuthList:[],authFlag:'1',rejReason:'',
                },
                agreeForm:{
                    actionFlag:'',bsnAuthList:[],authFlag:'0',
                },
                dialogTableVisible:false,
                oldBrhInf:{}
            }
        },
        mounted(){
            let temp={}
            $.each(this.oldDetailData,function(i,m){
                let key=i;
                let val=m.value;
                temp[key]=val;
            })

            this.oldBrhInf=temp
            this.$tools.utils.compareEdit(this.detailData,this.oldBrhInf)
        },
        methods:{
            back(){
                this.$emit("back")
            },
            rules(){//判断是否选中数据
               this.dialogTableVisible=true;
            },
            agree(){
               //判断是否选中数据
               console.log("toDetail"+JSON.stringify(this.toDetail))
                this.agreeForm.bsnAuthList.push(this.toDetail);
                console.log("agreeForm"+JSON.stringify(this.agreeForm))
                this.$tools.request(this,this.toDetail.bsnCode+"AuthAction.do",this.agreeForm).then(data=>{
                    //console.log("data"+JSON.stringify(data))
                    if(data.body.errorCode==0){
                        this.$message({
                            type:'success',
                            message:'Success',
                            showClose:true,
                        })
                        this.$emit("back")
                    }else{
                        this.$alert("System Error Try again", "warning",{
                            confirmButtonText: 'Confirm',
                            callback: action => {
                            }
                        })
                    }
                })
            },
            reject(){
                this.rejectForm.bsnAuthList.push(this.toDetail);
                console.log("rejectForm"+JSON.stringify(this.rejectForm))
                this.$tools.request(this,this.toDetail.bsnCode+"AuthAction.do",this.rejectForm).then(data=>{
                    if(data.body.errorCode==0){
                        this.$message({
                            type:'success',
                            message:'Success',
                            showClose:true,
                        })
                        this.$emit("back")
                    }else{
                        this.$alert("System Error Try again", "warning",{
                            confirmButtonText: 'Confirm',
                            callback: action => {
                            }
                        })
                    }
                })
            },
        }
        
    }

</script>